/**
 * 订单列表
 * @email 626097912@qq.com
 * Created by dength on 2017/04/10
 * 
 */
import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    TouchableOpacity,
    Alert
} from 'react-native';
import BaseComponent from '../base/baseComponent';
import Constants from '../base/constants';
import CommonStyles from '../base/commonStyles';

class OrderList extends BaseComponent {
    constructor(props) {
        super(props);
    }

    getNavigationBarProps() {
        return {
            title: '订单列表',
            leftButtonImage: require('../images/ic_return.png'),
            hideRightButton: true,
        };
    }

    renderBody() {
        return (
            <View style={styles.container}>
                <View style={styles.lists}>
                    <View style={styles.lists_top}>
                    <View style={styles.lists_top_box}>
                        <View style={styles.lists_top_box_one}>
                            <View style={styles.lists_top_box_center}>
                                <Text style={styles.lists_top_box_center_tx}>长沙南</Text>
                                <Text style={styles.lists_top_box_center_tx}>→</Text>
                                <Text style={styles.lists_top_box_center_tx}>深圳北</Text>
                            </View>
                            <View style={styles.lists_top_box_center}>
                                <Text style={[{ paddingRight: 10 },styles.lists_top_txcolor]}>2017-3-4</Text>
                                <Text style={styles.lists_top_txcolor}>星期二</Text>
                            </View>
                        </View>
                        <View style={styles.lists_top_box_one}>
                            <View style={styles.lists_top_box_center}>
                                <Text style={styles.lists_top_txcolor}>18:16</Text>
                                <Text style={styles.lists_top_txcolor}>-</Text>
                                <Text style={styles.lists_top_txcolor}>19:26</Text>
                            </View>
                            <View style={styles.lists_top_box_center}>
                                <Text style={styles.lists_top_txcolor}>￥</Text>
                                <Text style={styles.lists_top_txcolor}>603.5</Text>
                            </View>
                        </View>
                        <View style={styles.lists_top_box_one}>
                            <View style={styles.lists_top_box_center}>
                                <Text style={[{ paddingRight: 10 },styles.lists_top_txcolor]}>G6072</Text>
                                <Text style={styles.lists_top_txcolor}>08车08D</Text>
                            </View>
                        </View>
                    </View>
                    </View>
                    <View style={styles.lists_bottom}>
                        <TouchableOpacity
                            activeOpacity={0.8}
                            style={styles.buttom}
                            onPress={() => {
                                Alert.alert(
                                    "取消订单",
                                    "您确定取消当前订单吗？",
                                    [
                                        { text: "取消", onPress: () => { } },
                                        { text: "确定", onPress: () => { } },
                                    ]
                                );
                            } }
                            >
                            <Text style={styles.buttom_text}>取消订单</Text>
                        </TouchableOpacity>
                        <TouchableOpacity
                            activeOpacity={0.8}
                            style={styles.buttom}
                            onPress={() => {
                                Alert.alert(
                                    "删除订单",
                                    "您确定删除吗？",
                                    [
                                        { text: "取消", onPress: () => { } },
                                        { text: "确定", onPress: () => { } },
                                    ]
                                );
                            } }
                            >
                            <Text style={styles.buttom_text}>删除</Text>
                        </TouchableOpacity>
                        <TouchableOpacity
                            activeOpacity={0.8}
                            style={styles.buttom}>
                            <Text style={styles.buttom_text}>咨询</Text>
                        </TouchableOpacity>
                    </View>
                </View>
                
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: CommonStyles.colors.background,
    },
    buttom: {
        height: 30, borderColor: '#ADADAD', borderWidth: 1, alignItems: 'center', justifyContent: 'center',
        borderRadius: 5, paddingLeft: 22, paddingRight: 22, marginLeft: 20
    },
    buttom_text: {
        color: '#5A5A5A', fontSize: 14
    },
    lists:{
        backgroundColor: CommonStyles.colors.white,marginBottom:15
    },
    lists_top:{
        borderBottomWidth:1,borderBottomColor:'#EFF2F6',height:85
    },
    lists_top_box:{
        marginTop: 10, marginLeft: 10, marginRight: 10,
    },
    lists_top_box_one:{
        flexDirection: 'row', justifyContent: 'space-between',height:25 ,
    },
    lists_top_box_center:{
        flexDirection: 'row', justifyContent:'center'
    },
    lists_top_box_center_tx:{
        color:'#555555',fontWeight:'bold',fontSize:16
    },
    lists_top_txcolor:{
        color:'#999999'
    },
    lists_bottom:{
        flexDirection: 'row', justifyContent: 'flex-end', marginTop: 10,marginBottom:5,marginLeft: 10, marginRight: 10,
    },
});

export default OrderList;